<template>
	<view class="">
		<uni-nav-bar @clickLeft="$tab.back()" fixed="true" left-icon="left" backgroundColor="#fff"
			:title="`收货地址`" statusBar="true" :border="false" />
		<view class="p-20">
			<s-pull-scroll ref="pullScroll" :pullDown="pullDown" :pullUp="loadData" :fixed="false">
				<u-swipe-action>
					<u-swipe-action-item @click="getaddress($event,item.id)" :options="options"
						v-for="(item,index) in list" :key="index" :autoClose="true" :show="true">
						<view class="swipe-action">
							<view class="swipe-action__content p-20 flex justify-between items-center"
								@click="getaddress_back(item)">
								<image v-if="item.isDefault == 1" :src="label_moren" mode="widthFix"
									style="width: 62rpx;position: absolute;top: 0;left: 0;"></image>
								<view class="ml-28">
									<view class="">
										<text class="text-32">收货人：{{item.name}}</text>
										<text class="ml-24 text-gray">电话：{{item.mobile}}</text>
									</view>
									<view class="u-line-1 text-gray mt-12">
										{{item.area}}{{item.detail}}
									</view>
								</view>
								<image @click="getAdd(2,item.id)" :src="icon_xiugaidizhi" class="image-28 mr-24"
									mode="">
								</image>
							</view>
						</view>
					</u-swipe-action-item>
				</u-swipe-action>
			</s-pull-scroll>
		</view>

		<bottom-btn txt="添加常用地址" icon="https://file.fulewanjia.com/fulewanjia/profile/preImages/mine/icon_tianjia.png"
			@click="getAdd(1,null)"></bottom-btn>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				icon_xiugaidizhi: 'https://file.fulewanjia.com/fulewanjia/profile/preImages/image/icon_xiugaidizhi.png',
				label_moren: 'https://file.fulewanjia.com/fulewanjia/profile/preImages/image/label_moren.png',
				type: '',
				options: [{
					text: '设为默认',
					style: {
						backgroundColor: '#FF9E0B'
					}
				}, {
					text: '删除',
					style: {
						backgroundColor: '#f56c6c'
					}
				}],
				list: [], //数据列表
			};
		},
		onLoad(e) {
			if (e) {
				this.type = e.type
			}
		},
		onShow() {
			this.refresh()
		},
		methods: {
			refresh() {
				this.$nextTick(() => {
					this.$refs.pullScroll.refresh();
				});
			},
			pullDown(pullScroll) {
				setTimeout(() => {
					this.loadData(pullScroll);
				}, 200);
			},
			loadData(pullScroll) {
				setTimeout(async () => {
					if (pullScroll.page == 1) {
						this.list = [];
					}

					const res = await this.$Api.user.addressList({
						pageNum: pullScroll.page,
						pageSize: 10
					})

					this.list = this.list.concat(res.rows || []);

					if (res.total == 0) {
						pullScroll.empty();
					}else if(this.list.length >= res.total){
						pullScroll.finish();
					}else {
						pullScroll.success();
					}
				}, 500);
			},
			//添加修改地址
			getAdd(index, id) {
				if (index == 2) {
					let a = {
						name: '', //收货人名称
						mobile: '', //电话
						isDefault: false, //是否默认
						area: '', // 收获地址
						detail: '', //详细地址
						lat: '', //经度
						lnt: '', //纬度
					}
					this.list.forEach((i) => {
						if (i.id == id) {
							a.name = i.name;
							a.mobile = i.mobile;
							a.isDefault = i.isDefault;
							a.area = i.area;
							a.detail = i.detail; //详细地址
							a.lat = i.lat; //经度
							a.lnt = i.lnt; //纬度
							a.id = i.id;
						}
					})
					uni.navigateTo({
						url: '/pages/mine/address/add?a=' + encodeURIComponent(JSON.stringify(a))
					});
				} else {
					uni.navigateTo({
						url: `/pages/mine/address/add`,
					});
				}
			},
			getaddress_back(i) {
				if (this.type == 1) {
					uni.$emit('updateData', i)
					uni.navigateBack({
						delta: 1
					})
				}
				
				if (this.type == 2) {
					uni.setStorage({
						key:'exchangeAddress',
						data:i,
						success: () => {
							uni.navigateBack({
								delta: 1
							})
						}
					})
				}
			},
			getaddress(e, id) {
				var that = this
				if (e.index == 0) {
					this.$Api.user.addressUpdateDefault({
						addressId:id
					}).then((res) => {
						uni.$u.toast(res.msg)
						this.refresh()
					})
				} else {
					uni.showModal({
						title: '温馨提示',
						content: '是否删除当前地址',
						success: (res) => {
							if (res.confirm) {
								that.$Api.user.addressRemove({
									ids:id
								}).then((res) => {
									this.refresh()
								})
							}
						}
					});
				}
			},
		},
	};
</script>

<style lang="scss">
	.u-swipe-action {
		background-color: #F8F8F8 !important;
	}

	.u-swipe-action-item {
		margin-top: 20rpx;
		background-color: #fff;
		border-radius: 10rpx;
	}

	.swipe-action__content {
		display: flex;
		align-items: center;
		border-radius: 10rpx;
		background-color: #fff !important;
		position: relative;
	}
	.swipe-action {
		&__content {
			padding: 25rpx 0;

			&__text {
				font-size: 15px;
				color: $u-main-color;
				padding-left: 30rpx;
			}
		}
	}
</style>